<!DOCTYPE html>
<html lang="en">
<head>
  <title>Test::downloads::multiple files</title>
  <meta charset="UTF-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<button id="multiple-downloads">Download three files</button>
<script>
  (function() {
    function createLink(file) {
      let link = document.createElement('a');
      link.href = file.download;
      link.target = '_parent';
      if ('download' in link) {
        // Use a.download if available, it prevents plugins from opening.
        link.download = file.filename;
      }
      return link;
    }

    function downloadFile(file) {
      let link = createLink(file);
      (document.body || document.documentElement).appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
    }

    function downloadFiles(files) {
      files.forEach(function(file, index) {
        // The timeout is necessary for IE, which will otherwise only download the first file.
        setTimeout(function() {
          downloadFile(file);
        }, index);
      });
    }

    document.getElementById('multiple-downloads').addEventListener('click', function() {
      downloadFiles([
        {download: "download.html", filename: "download.html"},
        {download: "empty.html", filename: "empty.html"},
        {download: "hello_world.txt", filename: "hello_world.txt"},
      ]);
    }, false);
  })();
</script>
</body>
</html>
